<!-- 销售统计 -->
<template>
    <div class="page has-navbar saleStatic">
        <scroll class="page-content">
            <div class="manage-bill">
                <!-- <div class="select-date">
                    <span class="prev iconfont icon-jiantou left" @click="changeDate('reduce')"></span>
                    <div class="date">
                        <div class="now-date">{{nowDate}}</div>
                        <div class="end-time">截止23:59:59</div>
                    </div>
                    <span class="next iconfont icon-jiantou right" @click="changeDate('add')"></span>
                </div> -->
                <div class="end-time time-filter-sty">
                    <span>请选择时间：</span>
                    {{new Date(timeForDay).Format('yyyy-MM-dd')}}
                    <input id="day" type="text" readonly="" v-model="valForDay" style="opacity:0;position:absolute;top:0;width:100%;height:100%;"  placeholder="请选择时间" data-lcalendar="2016-05-11,2099-05-11" />
                </div>
            </div>
            <div class="cont">
              <div class="now common-panle">
                <div class="tit">所选时间数据 {{nowDate}} {{week[nowDay]}}</div>
                <div class="list">
                  <ul>
                    <li v-for="(item,index) in startSalesItem" :key="index">
                      <span class="cate-name">{{item.typeName}}</span>
                      <span class="cate-count">x{{item.qty}}</span>
                      <span class="cate-money right">￥{{item.amount}}</span>
                      <!-- <div class="item-detail">
                        <div class="detail-info">测试</div>
                        <div class="detail-info">测试</div>
                      </div> -->
                    </li>
                  </ul>
                  <div v-if="startSalesItem.length==0">暂无数据</div>
                </div>
              </div>
              <div class="prev common-panle">
                <div class="tit">同期数据 {{ringDate}} {{week[ringDay]}}</div>
                <div class="list">
                  <ul>
                    <li v-for="(item,index) in endSalesItem" :key="index">
                      <span class="cate-name">{{item.typeName}}</span>
                      <span class="cate-count">x{{item.qty}}</span>
                      <span class="cate-money right">￥{{item.amount}}</span>
                      <!-- <div class="item-detail">
                        <div class="detail-info">测试</div>
                        <div class="detail-info">测试</div>
                      </div> -->
                    </li>
                  </ul>
                  <div v-if="endSalesItem.length==0">暂无数据</div>
                </div>
              </div>
            </div>
        </scroll>
    </div>
</template>

<script type="text/javascript">
export default {
  props: ["storeId"],
  data() {
    return {
      timeForDay:"",
      valForDay:'',
      nowItem:{},//当前所选的分类
      showNowChild:false,
      nowDateParam:'',
      nowChild:[],//当前选择的分类下面的商品信息
      startDate: new Date().Format("yyyy-MM-dd"), //
      endDate: new Date().Format("yyyy-MM-dd"), //
      nowDate: "",//当前日期
      ringDate:"",//同期数据
      timestamp: 0, //当前时间戳
      newTimestamp: 0, //变化后的时间戳
      startSalesItem:[],
      endSalesItem:[],
      week:['星期天','星期一','星期二','星期三','星期四','星期五','星期六'],
      nowDay:0,//星期
      ringDay:0,//星期
    };
  },
  watch:{
    valForDay(val){
        this.timeForDay = val;

        let date = new Date(val.replace(/-/g,"/"));
        let month = date.getMonth() + 1;
        let year = date.getFullYear();
        let day = date.getDate();
        console.log(date.getTime())
        console.log(new Date().getTime())
        let nowDate = new Date();
        if(date.getTime() >= new Date(`${nowDate.getFullYear()}/${(nowDate.getMonth() + 1)}/${(nowDate.getDate())}`).getTime()){
          $toast.show("时间选择有误", 3000);
          return;
        }
        // 同期时间
        let ringDateTimestamp = date.getTime() - 7 * 24 * 60 * 60 * 1000;
        let ringDate = new Date(ringDateTimestamp);
        let ringMonth = ringDate.getMonth() + 1;
        let ringYear = ringDate.getFullYear();
        let ringDay = ringDate.getDate();

        this.nowDay = date.getDay();

        this.ringDay = ringDate.getDay();

        this.nowDate = month + "月" + day + "日";
        this.ringDate = ringMonth + "月" + ringDay + "日";
        let ringDateParam = `${ringYear}-${ringMonth>9?ringMonth:'0'+ringMonth}-${ringDay>9?ringDay:'0'+ringDay} 00:00:00`;
        
        this.getData(`${val} 00:00:00`,ringDateParam);
    },
    newTimestamp(val){
      let date = new Date(val);
      let month = date.getMonth() + 1;
      let year = date.getFullYear();
      let day = date.getDate();
      this.nowDateParam = dateParam;
      this.nowDay = date.getDay();
      // 同期时间
      let ringDateTimestamp = val - 7 * 24 * 60 * 60 * 1000;
      let ringDate = new Date(ringDateTimestamp);
      let ringMonth = ringDate.getMonth() + 1;
      let ringYear = ringDate.getFullYear();
      let ringDay = ringDate.getDate();

      this.ringDay = ringDate.getDay();
      // $loading.show("加载中...");
      let dateParam = `${year}-${month>9?month:'0'+month}-${day>9?day:'0'+day} 00:00:00`;
      let ringDateParam = `${ringYear}-${ringMonth>9?ringMonth:'0'+ringMonth}-${ringDay>9?ringDay:'0'+ringDay} 00:00:00`;
      this.ringDate = ringMonth + "月" + ringDay + "日";
      this.getData(dateParam,ringDateParam);
    }
  },
  methods: {
    changeDate(type) {
      if (type === "add") {
        let date = new Date();
        let year = date.getFullYear();
        //往后一天
        this.newTimestamp += 24 * 60 * 60 * 1000;
        if (this.newTimestamp > this.timestamp) {
          this.newTimestamp = this.timestamp;
          return;
        } else {
          let newDate = new Date(this.newTimestamp);
          this.nowDate = newDate.getMonth() + 1 + "月" + newDate.getDate() + "日";
        }
      } else {
        let date = new Date();
        let year = date.getFullYear();
        //往前一天
        this.newTimestamp -= 24 * 60 * 60 * 1000;
        if (this.newTimestamp < this.timestamp) {
          let newDate = new Date(this.newTimestamp);
          this.nowDate = newDate.getMonth() + 1 + "月" + newDate.getDate() + "日";
        } else {
          this.newTimestamp = this.timestamp;
          return;
        }
      }
    },
    getData(nowDate,prevDate){
      this.$http({
        url:"get-sales",
        method:"GET",
        params:{
          storeId:this.storeId,
          startTime:nowDate,
          endTime:prevDate
        }
      }).then(res=>{
        this.startSalesItem = res.data.startSalesItem;
        this.endSalesItem = res.data.endSalesItem;
      });
    }
  },
  created() {},
  mounted() {
    document.title = "同期日报表(周)";
    var calendar = new lCalendar();
    calendar.init({
        'trigger': '#day', //标签id
        'type': 'date', //date 调出日期选择 datetime 调出日期时间选择 time 调出时间选择 ym 调出年月选择,
    });
    //初始化时间
    let date = new Date();
    //获取当前时间（不包含时分秒）的时间戳
    let month = date.getMonth() + 1;
    let year = date.getFullYear();
    let day = date.getDate();
    let nowTimestamp = new Date(`${year}/${month}/${day}`).getTime();
    //计算出昨天的时间戳,之前只能查询前一天的数据，所以这里计算了一下时间，现在可以查当日的数据
    let prevDateTimestamp = nowTimestamp- 24 * 60 * 60 * 1000;
    let dateForDay = new Date(prevDateTimestamp).Format('yyyy/MM/dd');

    this.timeForDay = dateForDay;
    // 同期时间
    let ringDateTimestamp = prevDateTimestamp - 7 * 24 * 60 * 60 * 1000
    //初始时间两个时间戳一致
    this.timestamp = prevDateTimestamp;
    // this.newTimestamp = prevDateTimestamp;
    // this.timestamp = nowTimestamp;
    this.newTimestamp = prevDateTimestamp;
    //根据昨天的时间戳，获取昨天的日期
    let prevDate = new Date(prevDateTimestamp);
    let prevMonth = prevDate.getMonth() + 1;
    let prevYear = prevDate.getFullYear();
    let prevDay = prevDate.getDate();

    // 同期时间
    let ringDate = new Date(ringDateTimestamp);
    let ringMonth = ringDate.getMonth() + 1;
    let ringYear = ringDate.getFullYear();
    let ringDay = ringDate.getDate();

    //昨天的日期
    this.nowDate = prevMonth + "月" + prevDay + "日";
    this.nowDay = prevDate.getDay();
    //同期时间
    this.ringDate = ringMonth + "月" + ringDay + "日";
    this.ringDay = ringDate.getDay();
    //今天的日期
    // this.nowDate = month + "月" + day + "日";
    // 获取数据
    // let nowDateParam = `${year}-${month>9?month:'0'+month}-${day>9?day:'0'+day} 00:00:00`;
    let dateParam = `${prevYear}-${prevMonth>9?prevMonth:'0'+prevMonth}-${prevDay>9?prevDay:'0'+prevDay} 00:00:00`;
    let ringDateParam = `${ringYear}-${ringMonth>9?ringMonth:'0'+ringMonth}-${ringDay>9?ringDay:'0'+ringDay} 00:00:00`;
    this.getData(dateParam,ringDateParam);
  }
};
</script>
<style lang="scss" scoped>
@import "./ringReport.scss";
</style>
